input::-webkit-input-placeholder { /* WebKit browsers 适配谷歌 */
  color: $placehold;
}

// 滚动条的宽度
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
// 滚动条的滑块
::-webkit-scrollbar-thumb {
  background-color: rgba(144,147,153,.3);
  border-radius: 5px;
  cursor: pointer !important
}

html, body {
  height: 100%;
  font-family: 'Microsoft YaHei';
  // font-family: Source Han Serif CN;
  overflow-y: hidden;
  background: $bg;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.mask {
  full(fixed);
  z-index: 1390;
  background: rgba(0, 0, 0, .6);
}

.dialog-foot {
  flexMiddle(space-around);
  min-height: getPx(50);
  width: 90%;
  margin: getPx(20) auto 0;
}

.dialog-foot-btn {
  cursor: pointer;
  width: getPx(160);
  height: getPx(50);
  font-size: $sub-font-size;
  background: $btn-bg;
  border-radius: $radius-sm;
  flexMiddle(center);
}

.label-status {
  width: getPx(46);
  height: getPx(22);
  border-radius: $radius-ty;
  font-size: $sm-font-size;
  flexMiddle(center);
}

.page {
  color: #fff;
  background: url('/platform/img/bg.png');
  background-size:auto 100%;
  overflow: hidden;
  full(absolute);
}
.pageHeader {
  margin-top: getPx(20);
  height: getPx(80);
  width: 100%;
  flexMiddle(space-between);
}
.close {
  cursor: pointer;
  color: $close;
  font-size: $big-font-size;
  position: absolute;
  top: getPx(10);
  right: getPx(30);
}

.sec {
  border-radius: $radius-sm;
  background: $sec-bg;
}

.sec-title {
  color: $sec-title-color;
  font-size: $sec-title-font-size;
}

.select {
  padding-left: 0;
  .opt {
    list-style: none;
    display: block;
    height: getPx(30);
    cursor: pointer;
    padding-left: getPx(15);
    flexMiddle(flex-start);
    &:hover {
      background: $sec-dark-bg;  
    }
  }
}

.select-box {
  li {
    line-height: getPx(24);
    cursor: pointer;
    user-select: none;
    padding: getPx(2) getPx(5);
    margin: getPx(4) 0;
    list-style: none;
    &:hover{
      background: #f0f5f9;
    }
  }
  .activeLi {
    background: #f0f5f9;
  }
}

.date-pick_select {
  width: 100%;
  height:40px;
}

.export-btn {
  width: 60px;
  height: 30px;
  border-radius: getPx(28);
  cursor: pointer;
  border: 1px solid $border-color;
  font-size: $sub-font-size;
  flexMiddle(center);
  position: absolute;
  right: getPx(45);
  @media all and (max-height: $h) {
    height: 26px;
  }
}
.export-btn&:hover {
  background: #374760;
}

.export-cold {
  height: 30px;
  left: 380px;
  right: auto;
  z-index: 11; 
  @media all and (max-height: $h) {
    height: 26px;
  }
}

.singPicktime {
  width: getPx(160);
  height: getPx(40);
  max-height: 32px;
  .el-date-editor {
    width: 100%;
  }
}

.ellipCount {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

.text-center {
  text-align: center;  
}
.nothing {
  height: getPx(40);
  font-size: $sm-font-size;
  flexMiddle(center);
}

.picker-right {
  float: right;
  width: 260px;
}

.page-head {
  padding: 0 getPx(35);
  height: getPx(70);
  flexMiddle(space-between);
  .page-title {
    font-size: $page-head-font-size;
    color: $primary;
  }
  .page-bread {
    color: $primary;
    font-size: $page-bread-font-size;
    flexMiddle(space-around);
    .bread-prev {
      cursor: pointer;  
    }
    .bread-divider {
      margin: 0 getPx(30);
    }
    .bread-now {
      font-size: $page-head-font-size;
      font-weight: bold;
    }
  }
  .page-tool {
    flexMiddle(space-between);
    .tool-btn {
      margin-left: getPx(15);
      width: getPx(94);
      height: getPx(36);
      cursor: pointer;
      color: $white;
      border-radius: $radius-mi;
      font-size: $sm-font-size;
      background: $primary;
      flexMiddle(center);  
    } 
  }
}

.tool-sel {
  width: getPx(160);
  min-width: 140px;
  height: getPx(34);
  margin-right: getPx(20);
  .el-input {
    height: 100%;
    position: relative;
    .el-select__caret {
      position: absolute;
      top: 50%;
      right: 0
      transform: translate(0, -40%) rotateZ(180deg);
      &.is-reverse {
        transform: translate(0, -40%) rotateZ(180deg);
      }
      @media all and (max-height: $h) {
        transform: translate(0, -20%) rotateZ(180deg);
        &.is-reverse {
          transform: translate(0, -20%) rotateZ(180deg);
        }
      }
    }  
  }
  .el-input__inner {
    background: transparent;
    border-radius: getPx(20);
  }
}

.page-body {
  padding: 0 getPx(35);
}

.dialog-body {
  padding: 20px;
}

.upload-img {
  width: getPx(142);  
  height: getPx(142);  
}

.txt-btn {
  cursor: pointer;
  font-size: $sm-font-size;
}

.upload-form-item {
  position: relative;
  input {
    cursor: pointer;
  }
  .file-input {
    opacity: 0;
    width: 100%;
    position: absolute;
    z-index: 1;
    top: 50%;
    left: 0;
    right: 0;
    transform: translate(0, -50%);
    cursor: pointer;  
  }
  .pick-img {
    position: absolute;
    top: 50%;
    right: getPx(10);
    transform: translate(0, -50%);
    width: getPx(18);
    height: getPx(18);
    cursor: pointer;  
  }  
}

.under-item {
  margin-top: getPx(-10);  
}

.operation-col {
  flexMiddle(center);
}

.thumb-img {
  // object-fit: scale-down;  
}

.status {
  color: $white;
  font-size: $sub-font-size;
  background: $success;
  border-radius: $radius-mi; 
  width: getPx(64);
  height: getPx(24);
  flexMiddle(center);
  &.warn {
    background: $warn;
  }
  &.warn {
    background: $grey;
  }
  
}

.video-player {
  width: getPx(1200);
  height: getPx(600);
  display: block;
  margin: 0 auto;
  position: relative;  
}

.music-wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 60%;  
}

.img-wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80%;
  height: 60%;
  img {
    width: 100%;
    height: 100%;
  } 
}

.radios-wrapper {
  height: getPx(40);
  transform: translate(0, getPx(15));
  flexMiddle(center);  
}

.form-sel {
  width: 100%;  
}

.loadingGif {
  color: $primary;  
}

.check {
	width: getPx(26);
	height: getPx(26);
	border: getPx(3) solid #d7d7d9;
  border-radius: 50%;
}

@keyframes alwaysRote {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}

.doRotate {
  animation: alwaysRote 3s linear infinite;
}

.Modal {
  z-index: 1030;
  background: rgba(0, 0, 0, .3);
  full(fixed);  
}

.msg-title {
  margin: getPx(20) getPx(20) 0;  
}

.banner {
  height: getPx(200);
  margin: getPx(20);
  .banner-img {
    height: getPx(200);
    width: 100%;
  }
}

.msg-desc {
  margin: 0 getPx(20) getPx(40);
  padding-bottom: getPx(5); 
  max-height: getPx(320);
  box-sizing: border-box;
  overflow-y: auto;
}

.btn-row {
  height: getPx(31);
  margin: getPx(31) 0 getPx(20) 0;
  flexMiddle(space-between);
}
.second-btn {
  width: getPx(122);
  height: getPx(31);
  font-size: $base-font-size;
  color: $white;
  background: $primary;
  border-radius: getPx(5);
  cursor: pointer;
  flexMiddle(center);
}

.disabled {
  background: $grey;
  cursor: not-allowed;  
}

.round-btn {
  cursor: pointer;
  width: getPx(64);
	height: getPx(29);
	background-color: #df3326;
	border-radius: getPx(26);
  color: $white;
  font-size: $round-btn-font-size;
  flexMiddle(center);  
}

.modal {
  full(absolute);
  z-index: 1025;
  background: rgba(0, 0, 0, .3);  
}


.page-footer {
  flexMiddle(flex-end);

  .page-pager {
    margin-right: getPx(20);
  }

  .page-button {
    border: 1px solid #a60000;
    color: #a60000;
    height: getPx(28);
    cursor: pointer;
    text-align: center;
    border-radius: getPx(4);
    font-size: getPx(13);
    width: getPx(60);
    text-align: center;
    white-space: nowrap;
    &:focus {
      outline: none;
    }
  }
}

.none {
  flexMiddle(center);
  color: $label-color;
  font-size: $base-font-size;
}

.video {
  width: 100%;
  height: 100%;  
  &:focus {
    outline: none;  
  }
}

.back {
  cursor: pointer;
  height: getPx(40); 
  flexMiddle(center);
  .back-img {
    width: getPx(23);
    height: getPx(37);  
  }
  .back-txt {
    font-size: getPx(30);
    margin-left: getPx(10);
  }
}

.logo {
  width: getPx(927 * 0.5);
  height: getPx(97 * 0.5);
}

.none {
  width: 100%;
  height: 100%;
  background: #eee;
  color: #333;
  font-size: getPx(30);
  flexMiddle(center);  
}

.preview-dialog {
  width: 100vw;
  height: 100vh;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  .dialog-button {
    position: absolute;
    top: getPx(10);
    right: getPx(10);
    cursor: pointer;
    font-size: getPx(20); 
    text-shadow: 0 0 getPx(10) #fff;
    z-index: 99; 
  }  
}

.frameDialog {
  border-radius: 0;  
}

.iFrame {
  width: 100vw;
  height: 94vh;  
}

// video::-webkit-media-controls-fullscreen-button{ display: none !important; }

// /*video默认aduio音量按钮*/
// video::-webkit-media-controls-mute-button { display: none !important;}

// /*video默认setting按钮*/
// video::-internal-media-controls-overflow-button{ display: none !important;}

// /*腾讯云点播禁用firefox全屏、设置按钮*/
// .trump-button[sub-component="fullscreen_btn"],.trump-button[now="fullscreen"]{ display:none!important;}
// .trump-button[sub-component="setting"]{ display:none !important;}

// /*禁用video的controls（要慎重！不要轻易隐藏掉，会导致点击视频不能播放）*/
// video::-webkit-media-controls {
//   display:none !important;
// }


